<!DOCTYPE html>
<html class="x-admin-sm" lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Mobile Shop</title>

    <!-- Bootstrap Core CSS -->
    <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}" type="text/css">

    <!-- Custom CSS -->
    <link rel="stylesheet" th:href="@{/css/style.css}">


    <!-- Custom Fonts -->
    <link rel="stylesheet" th:href="@{/font-awesome/css/font-awesome.min.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/fonts/font-slider.css}" type="text/css">

    <!-- jQuery and Modernizr-->
    <script th:src="@{/js/jquery-2.1.1.js}"></script>

    <!-- Core JavaScript Files -->
    <script th:src="@{/js/bootstrap.min.js}"></script>

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
	        <script th:src="@{/js/html5shiv.js}"></script>-->
    <!--		<script th:src="@{/js/respond.min.js}"></script>&ndash;&gt;-->
    <!--    [endif]&ndash;&gt;-->
</head>

<body>
<header style="padding:0">
    <div th:replace="../templates/header::header"></div>
</header>
<!--//////////////////////////////////////////////////-->
<!--///////////////////Contact Page///////////////////-->
<!--//////////////////////////////////////////////////-->
<div id="page-content" class="single-page">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <ul class="breadcrumb">
                    <li><a th:if="${isLogin}"
                           th:href="@{/user/index(userId=${userId},username=${username},roleId=${roleId})}">Home</a>
                    </li>
                    <li><a th:href="@{/user/toAddress(userId=${userId})}">Contact</a></li>
                </ul>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <div class="heading"><h1>CONTACT US</h1></div>
            </div>
            <div class="col-md-6" style="margin-bottom: 30px;">
                <form name="form1" id="ff" method="post">
                    <!--                    你的名字 address_people-->
<!--                    <input type="hidden" th:value="${user1.userId}" id="userId">-->
                    <div class="form-group">
                        <input type="text" class="form-control" placeholder="Your Name *" name="address_people"
                               id="address_people" required
                               data-validation-required-message="Please enter your name.">
                    </div>
                    <!--                    你的电话 address_tel-->
                    <div class="form-group">
                        <input type="tel" class="form-control" placeholder="Your Phone *" name="address_tel"
                               id="address_tel"
                               required data-validation-required-message="Please enter your phone number.">
                    </div>
                    <!--                    你的地址 address_name-->
                    <div class="form-group">
                        <textarea class="form-control" placeholder="Your Message *" name="address_name"
                                  id="address_name" required
                                  data-validation-required-message="Please enter a message."></textarea>
                    </div>
                    <button type="button" class="btn btn-1" onclick="determine()">Determine</button>
                </form>
            </div>
            <div class="col-md-6">
                <p><span class="glyphicon glyphicon-home"></span> California, United States 3000009</p>
                <p><span class="glyphicon glyphicon-earphone"></span> +6221 888 888 90 , +6221 888 88891</p>
                <p><span class="glyphicon glyphicon-envelope"></span> info@yourdomain.com</p>
                <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3164.289259162295!2d-120.7989351!3d37.5246781!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8091042b3386acd7%3A0x3b4a4cedc60363dd!2sMain+St%2C+Denair%2C+CA+95316%2C+Hoa+K%E1%BB%B3!5e0!3m2!1svi!2s!4v1434016649434"
                        width="95%" height="230" frameborder="0" style="border:0"></iframe>
            </div>
        </div>
    </div>
</div>
<footer>
    <div th:replace="../templates/footer::footer"></div>
</footer>
</body>
<script>
    function determine() {
        var userId = $("#userId").val();
        var basePath = '[[${#httpServletRequest.getContextPath()}]]';
        var formObject = $("#ff").serialize();

        $.ajax({
            url: basePath + "/user/addressAdd",
            type: "post",
            async: false,
            data: formObject,
            success: function (obj) {
                if (obj.success) {
                    alert("111111");
                    location.replace;
                    //     location.href = basePath + "/user/center?userId="+userId;
                } else {
                    alert("2222");
                    alert(obj.msg);
                }
            },
            dataType: "json"
        })
    }
</script>
</html>
